<template>
  <div class="box">
    <header class="header">
      <van-nav-bar
        title="个人中心"
        left-arrow
      />
    </header>
    <div class="content">
      <div v-if="flag">
        <van-uploader v-model="fileList" :before-read="beforeRead" :max-count="1" :after-read="afterRead"/>
        欢迎您*****
        <button @click="logout">退出</button>
      </div>
      <div v-else>
        <router-link to="/register">注册</router-link>/
        <router-link to="/login">登陆</router-link>
      </div>
    </div>
  </div>
</template>

<script>
import Vue from 'vue'
import { Uploader, Toast } from 'vant'

Vue.use(Uploader)
Vue.use(Toast)
export default {
  data () {
    return {
      flag: false,
      fileList: []
    }
  },
  mounted () {
    if (sessionStorage.getItem('loginstate') === 'true') {
      this.flag = true
    } else {
      this.flag = false
    }
  },
  methods: {
    logout () {
      sessionStorage.removeItem('loginstate')
      this.flag = false
      this.$router.push('/login')
    },
    afterRead (file) {
      console.log('file', file)
    },
    beforeRead (file) {
      console.log(file)
      if (file.type !== 'image/jpeg') {
        Toast('请上传 jpg 格式图片')
        return false
      }
      return true
    }
  }
}
</script>
